<template>
    <div>
        <apply-header :flag="'1'"></apply-header>
        <div class="main">
            <Side :step="'1'"></Side>
            <section>
                <el-tabs v-model="activeIndex" style="background: #fff;border: 1px solid #dddfe3;padding: 10px;border-radius: 10px">
                    <el-tab-pane label="Claim Form Exam" name="0">
                        <claimFormExam></claimFormExam>
                    </el-tab-pane>
                    <el-tab-pane label="EOB Exam" name="1">EOB Exam</el-tab-pane>
                    <el-tab-pane label="Radiography Exam" name="2">Radiography Exam</el-tab-pane>
                </el-tabs>
            </section>
        </div>
    </div>
</template>

<script>
    import ApplyHeader from "../../components/ApplyHeader"
    import Side from '../../components/Aside.vue'
    import claimFormExam from "./claimFormExam";
    export default {
        name: "dentalBillingTest",
        components:{ApplyHeader,Side,claimFormExam},
        data(){
            return{
                activeIndex:'0',
                exitVisible:false,
                showResult:false,
                smallScreen:false,
                correctNum:0,
                totalNum:34,
                form:{
                },
                isAdmin:true,
                /**表单验证规则，所有选项都不允许为空  第10题和第26题如果一个都没有选也会提示**/
                rules: {
                    sub0: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub1: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub2: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub3: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub4: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub5: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub6: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub7: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub8: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub9: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub10: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub11: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub12: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub13: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub14: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub15: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub16: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub17: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub18: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub19: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub20: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub21: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub22: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub23: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub24: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub25: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub26: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub27: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub28: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub29: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub30: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub31: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub32: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ],
                    sub33: [
                        {required: true, message: 'Required', trigger: 'blur'},
                    ]
                }
            }
        },
        computed:{
            /**根据用户自己选择算出正确率**/
            correctPercent(){
                return ((this.correctNum/this.totalNum).toFixed(4)*100)+'%'
            },
            correctBalance(){
                return function (form,num) {
                    return this.coverBalance(form,num)&&this.coverBalance(form,num+'.00')
                        &&this.coverBalance(form,'$'+num)&&this.coverBalance(form,'$'+num+'.00')
                }

            },
        },
        methods:{
            coverBalance(subStr,str){
                var reg = eval("/"+subStr+"/ig");
                return reg.test(str);
            },
            calScore(){//算正确分数 总分80
                var score=0
                this.correctNum=0
                if(this.form.sub0==3) {score += 3;this.correctNum++}
                if(this.form.sub1==1) {score += 3;this.correctNum++}
                if(this.form.sub2==0) {score += 3;this.correctNum++}
                if(this.form.sub3==0) {score += 3;this.correctNum++}
                if(this.form.sub4==3) {score += 3;this.correctNum++}
                if(this.form.sub5==1) {score += 3;this.correctNum++}
                if(this.form.sub6==1) {score += 3;this.correctNum++}
                if(this.form.sub7==2) {score += 3;this.correctNum++}
                if(this.form.sub8==3) {score += 3;this.correctNum++}
                if(this.form.sub9==3) {score += 3;this.correctNum++}
                if(this.form.sub10==2) {score += 3;this.correctNum++}
                if(this.form.sub11==1) {score += 3;this.correctNum++}
                if(this.form.sub12==0) {score += 3;this.correctNum++}
                if(this.form.sub13==3) {score += 3;this.correctNum++}
                if(this.form.sub14==1) {score += 3;this.correctNum++}
                if(this.form.sub15==2) {score += 3;this.correctNum++}
                if(this.form.sub16==3) {score += 3;this.correctNum++}

                if(this.form.sub17==2) {score += 2;this.correctNum++}

                if(this.form.sub18==2) {score += 3;this.correctNum++}
                if(this.form.sub19==2) {score += 3;this.correctNum++}
                if(this.form.sub20==2) {score += 3;this.correctNum++}
                if(this.form.sub21==2) {score += 3;this.correctNum++}
                if(this.form.sub22==3) {score += 3;this.correctNum++}
                if(this.form.sub23==2) {score += 3;this.correctNum++}
                if(this.form.sub24==0) {score += 3;this.correctNum++}
                if(this.form.sub25==0) {score += 3;this.correctNum++}
                if(this.form.sub26==3) {score += 3;this.correctNum++}
                if(this.form.sub27==1) {score += 3;this.correctNum++}
                if(this.form.sub28==0) {score += 3;this.correctNum++}
                if(!this.form.sub29) {score += 1;this.correctNum++}
                if(this.form.sub30==2) {score += 4;this.correctNum++}
                if(this.form.sub31==this.correctBalance('40')) {score += 3;this.correctNum++}
                if(this.form.sub32==this.correctBalance('643')) {score += 3;this.correctNum++}
                if(this.form.sub33==4) {score += 3;this.correctNum++}
                return score
            },
            goPre(){
                this.$router.go(-1)
            },
            cancel(){
                this.exitVisible=true
            },
            submit(){
                this.$refs['form'].clearValidate()
                this.$nextTick(() => {
                    this.$refs['form'].validate((valid,object) => {
                        if (valid) {
                            console.log('submit',this.form)
                            var score=0
                            var list=[]
                            for(var i in this.form){
                                list.push(this.form[i])
                            }
                            score = this.calScore()
                            var storeService = this.$store.state.serviceInfo
                            var positionInfo = this.$store.state.positionInfo
                            var params={}
                            params.serviceId =storeService.serviceId
                            params.versionId = storeService.serviceVersion
                            params.score = score
                            params.possible = 80
                            params.positionId = positionInfo.positionId
                            params.status = score>storeService.servicePassScore
                            params.detail = JSON.stringify(list)
                            // params.applicantEmail=localStorage.getItem('email')
                            // this.$axios.post(this.$URL.medicalTestUrl,params).then(res=>{
                            //     if(res.code==0){
                            //         this.goBack()
                            //     }else{
                            //         this.$message.error({message:res.msg})
                            //     }
                            // }).catch(err=>{
                            //     this.$message.error({message:err})
                            // })
                        }else {
                            var obj = Object.keys(object)[0]
                            let dom = this.$refs[obj]
                            dom.$el.scrollIntoView({
                                //滚动到指定节点
                                block: 'center', //值有start,center,end，nearest，当前显示在视图区域中间
                                behavior: 'smooth' //值有auto、instant,smooth，缓动动画（当前是慢速的）
                            })
                            console.log('error submit!!');
                            return false;
                        }
                    })
                })
            },
        },
        mounted() {
            var clientW = document.documentElement.clientWidth
            if(clientW<1220){
                this.smallScreen=true
            }
        },
        watch:{
            '$route'(to,from){
                console.log(from.path)
                if(to.path==='/dentalBillingTest'){
                    this.getData()
                }
            }
        }
    }
</script>

<style scoped>
    .rightPic{
        width: 20px;
        position: absolute;
        right: 20px
    }
    .el-radio{
        width:200px;
        height:43px;
        line-height:20px!important;
    }
    .radioText{
        display: inline-block;
    }
    .box>>>.el-radio__label{
        vertical-align: middle!important;
    }
</style>